<template>
  <div class="row-main" style="display: flex;justify-content: center;align-items: center">
    <el-card class="box-card" style="width: 700px">
      <div slot="header" class="clearfix" style="text-align: center">
        <b>参数配置</b>
      </div>
      <el-form :model="form" ref="form" :rules="formRules" label-width="240px" >
        <el-form-item label="无返佣代理和企业级客户余额下限" prop="user_BALANCE_LOWER_LIMIT">
          <el-input size="small" type="number" min="0" max="999999" v-model="form.user_BALANCE_LOWER_LIMIT" style="width: 90%"></el-input>
        </el-form-item>
        <el-form-item label="代理返佣提现申请上限" prop="agent_APPLY_UP">
          <el-input size="small" type="number" min="0" max="999999" v-model="form.agent_APPLY_UP" style="width: 90%" ></el-input>
        </el-form-item>
        <el-form-item label="代理返佣提现申请下限" prop="agent_APPLY_DOWN">
          <el-input size="small" type="number" min="0" max="999999" v-model="form.agent_APPLY_DOWN" style="width: 90%" ></el-input>
        </el-form-item>
        <el-form-item label="自动返佣最小金额" prop="agent_MIN_BALANCE">
          <el-input size="small" type="number" min="0" max="999999" v-model="form.agent_MIN_BALANCE" style="width: 90%" ></el-input>
        </el-form-item>
        <el-form-item label="冷冻卡认定期限" prop="cold_CARD_CONFIG">
          <el-input size="small" type="number" min="0" max="999999" v-model="form.cold_CARD_CONFIG" style="width: 90%" ></el-input>
        </el-form-item>
        <el-form-item label="代理充值下限" prop="agent_RECHARGE_DOWN">
          <el-input size="small" min="10" max="100" v-model="form.agent_RECHARGE_DOWN" style="width: 90%" ><template slot="append">元</template></el-input>
        </el-form-item>
        <el-form-item label="代理充值手续费" prop="agent_RECHARGE_RATE">
          <el-input size="small" min="0" max="20" v-model="form.agent_RECHARGE_RATE" style="width: 90%" ><template slot="append">%</template></el-input>
        </el-form-item>
        <el-form-item label="代理提现手续费" prop="agent_APPLY_BALANCE_RATE">
          <el-input size="small" min="0" max="20" v-model="form.agent_APPLY_BALANCE_RATE" style="width: 90%" ><template slot="append">%</template></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="ok('form')" :loading="sub">提交</el-button>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>

<script>
  import {getConfig,saveSetting} from '@/api/getData'

  export default {
    name: 'resourceSave',

    data() {
      return {
        sub: false,
        formRules: {
          user_BALANCE_LOWER_LIMIT: [
            {required: true, message: '请输入无返佣代理和企业级客户余额下限', trigger: 'blur'},
            {validator: this.numberValidata, min: 0, max: 99999, trigger: 'blur'}
          ],
          agent_APPLY_UP: [
            {required: true, message: '请输入代理返佣提现申请上限', trigger: 'blur'},
            {validator: this.numberValidata, min: 0, max: 99999, trigger: 'blur'},
            {validator: this.upGtDown, trigger: 'blur'}
          ],
          agent_APPLY_DOWN: [
            {required: true, message: '请输入代理返佣提现申请下限', trigger: 'blur'},
            {validator: this.numberValidata, min: 0, max: 99999, trigger: 'blur'},
            {validator: this.upGtDown, trigger: 'blur'}
          ],
          agent_RECHARGE_DOWN: [
            {required: true, message: '请输入代理返佣提现申请下限', trigger: 'blur'},
            {validator: (rule, value, callback) => {
                if (value < rule.min || value > rule.max) {
                    callback(new Error(`输入范围是${rule.min}-${rule.max}`));
                } else {
                  let reg = /^[0-9]+(\.[0-9]{2})?$/;
                  if(!reg.test(value)){
                    callback(new Error('金额格式错误'))
                  }
                  else{
                    callback()
                  }
                }
              }, min: 10, max: 999999, trigger: 'blur'},
          ],
          agent_MIN_BALANCE: [
            {required: true, message: '请输入自动返佣最小金额', trigger: 'blur'},
            {validator: this.numberValidata, min: 0, max: 99999, trigger: 'blur'}
          ],
          cold_CARD_CONFIG: [
            {required: true, message: '请输入冷冻卡认定期限', trigger: 'blur'},
            {validator: this.numberValidata, min: 0, max: 99999, trigger: 'blur'}
          ],
          agent_RECHARGE_RATE: [
            {required: true, message: '代理充值手续费', trigger: 'blur'},
            {validator: this.moneyValidata, min: 0, max: 20, trigger: 'blur'}
          ],
          agent_APPLY_BALANCE_RATE: [
            {required: true, message: '代理提现手续费', trigger: 'blur'},
            {validator: this.moneyValidata, min: 0, max: 20, trigger: 'blur'}
          ]
        },
        fileName:'',
        form: {
          user_BALANCE_LOWER_LIMIT:'',
          agent_APPLY_UP:'',
          agent_APPLY_DOWN:'',
          agent_MIN_BALANCE:'',
          cold_CARD_CONFIG:'',
          agent_RECHARGE_RATE:'',
          agent_RECHARGE_DOWN:'',
        }
      }
    },
    async created() {
      this.getOne();
    },
    methods: {
      goBack() {
        this.$route.back(-1);
      },
      ok(form) {
        this.$refs['form'].validate(async (valid) => {
          if(valid){
            const a = await saveSetting([
                { oemConfigId: "1002", data: this.form.user_BALANCE_LOWER_LIMIT },
                { oemConfigId: "1003", data: this.form.agent_APPLY_UP },
                { oemConfigId: "1004", data: this.form.agent_APPLY_DOWN },
                { oemConfigId: "1006", data: this.form.agent_MIN_BALANCE },
                { oemConfigId: "1007", data: this.form.cold_CARD_CONFIG },
                { oemConfigId: "1008", data: (this.form.agent_RECHARGE_RATE/100).toFixed(3) },
                { oemConfigId: "1009", data: (this.form.agent_APPLY_BALANCE_RATE/100).toFixed(3) },
                { oemConfigId: "1010", data: this.form.agent_RECHARGE_DOWN },
              ],
              {
                obj: this,
                key: 'sub'
              })
            this.sub = false;
            if (a._result) {
              this.sub = false
              this.$message.success('更新成功')
              this.getOne();
            }
          }
        })
      },
      changeFile(){
        let f= this.$refs.key.files[0];
        this.fileName = f.name;
      },
      async getOne(){
        let one = await getConfig();
        if(one._result&&one.data!=null){
          this.form = one.data;
          this.form.agent_RECHARGE_RATE = parseFloat(one.data.agent_RECHARGE_RATE *100).toFixed(1);
          this.form.agent_RECHARGE_DOWN = one.data.agent_RECHARGE_DOWN;
          this.form.agent_APPLY_BALANCE_RATE = parseFloat(one.data.agent_APPLY_BALANCE_RATE *100).toFixed(1);
        }
      },
      numberValidata(rule, value, callback) {
        const val = parseInt(value, 10);
        if (!val && value !== '' && val !== 0) {
          callback(new Error('请输入有效数字'))
        }
        if (val < rule.min || val > rule.max) {
            callback(new Error(`输入范围是${rule.min}-${rule.max}`));
        } else {
          callback()
        }
      },
      moneyValidata(rule, value, callback) {
        let reg = /^(0|[1-9][0-9]*)+(\.[0-9]{1})?$/;
        let val = parseFloat(value);
        if(val>0 && val<0.1){
          callback(new Error('不可设置0 ~ 0.1%之间的费率'));
        }
        else if (val < rule.min || val > rule.max) {
          callback(new Error(`输入范围是${rule.min}-${rule.max}`));
        } else if(!reg.test(value)){
          callback(new Error('请输入有效金额数字，最多1位小数'));
        } else {
          callback();
        }

      },
      upGtDown(rule, value, callback){
        if(this.form.agent_APPLY_UP*1<=this.form.agent_APPLY_DOWN*1){
          callback(new Error('代理申请余额上限不能小于等于下限'))
        }else{
          callback()
        }
      }
    }
  }
</script>

<style scoped>
  .file_upload_box {
    display: inline-block;
    width: 200px;
    height: auto;
    position: relative;
    overflow: hidden;
  }
  .file_upload_box input[type=file] {
    position: absolute;
    left: 0;
    top: 6px;
    width: 100px;
    line-height: 25px;
    opacity: 0;
    cursor: pointer;
  }
  .file_upload_box a {
    display: inline-block;
    width: 50%;
    line-height: 25px;
    text-align: center;
    font-family: "Microsoft yahei";
    background-color: #315baf;
    color: #FFF;
    font-weight: 700;
    text-decoration: none;
  }
</style>
